<template>
	<el-main>
		<el-form label-width="100px">
			<el-row>
				<el-col :md="12">
					<el-form-item label="邮箱主题">
						<el-input placeholder="请输入邮箱主题"></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :md="12">
					<el-form-item label="Cc">
						<el-input></el-input>
					</el-form-item>
				</el-col>
				<el-col :md="12">
					<el-form-item label="Bcc">
						<el-input></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col>
					<el-form-item label="邮件内容">
						<el-card shadow="never">
							<sc-editor v-model="html" placeholder="请输入" :templates="templates" :height="400"></sc-editor>
						</el-card>
					</el-form-item>
				</el-col>
			</el-row>
		</el-form>
	</el-main>
</template>

<script>
import { defineAsyncComponent } from 'vue';
const scEditor = defineAsyncComponent(() => import('@/components/scEditor'));

export default {
	name: "editor",
	components: {
		scEditor
	},
	data() {
		return {
			html: '',
			templates: [
				{
					title: '自定义HTML模板',
					description: '',
					content: '<strong>演示模板</strong>'
				},
				{
					title: '列表',
					description: '',
					content: '<ol><li>演示列表1</li><li>演示列表2</li></ol>'
				}
			]
		}
	}
}
</script>

<style></style>
